<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8"/>
  <title>iconfont Demo</title>
  <link rel="shortcut icon" href="//img.alicdn.com/imgextra/i2/O1CN01ZyAlrn1MwaMhqz36G_!!6000000001499-73-tps-64-64.ico" type="image/x-icon"/>
  <link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01EYTRnJ297D6vehehJ_!!6000000008020-55-tps-64-64.svg"/>
  <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
  <link rel="stylesheet" href="demo.css">
  <link rel="stylesheet" href="iconfont.css">
  <script src="iconfont.js"></script>
  <!-- jQuery -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
  <!-- 代码高亮 -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
  <style>
    .main .logo {
      margin-top: 0;
      height: auto;
    }

    .main .logo a {
      display: flex;
      align-items: center;
    }

    .main .logo .sub-title {
      margin-left: 0.5em;
      font-size: 22px;
      color: #fff;
      background: linear-gradient(-45deg, #3967FF, #B500FE);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
  </style>
</head>
<body>
  <div class="main">
    <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">
      <img width="200" src="https://img.alicdn.com/imgextra/i3/O1CN01Mn65HV1FfSEzR6DKv_!!6000000000514-55-tps-228-59.svg">
      
    </a></h1>
    <div class="nav-tabs">
      <ul id="tabs" class="dib-box">
        <li class="dib active"><span>Unicode</span></li>
        <li class="dib"><span>Font class</span></li>
        <li class="dib"><span>Symbol</span></li>
      </ul>
      
      <a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=3243010" target="_blank" class="nav-more">查看项目</a>
      
    </div>
    <div class="tab-container">
      <div class="content unicode" style="display: block;">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
              <span class="icon iconfont">&#xe649;</span>
                <div class="name">五边形1</div>
                <div class="code-name">&amp;#xe649;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe605;</span>
                <div class="name">my-admin</div>
                <div class="code-name">&amp;#xe605;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a0;</span>
                <div class="name">qq</div>
                <div class="code-name">&amp;#xe6a0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe709;</span>
                <div class="name">github</div>
                <div class="code-name">&amp;#xe709;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe677;</span>
                <div class="name">gitee2</div>
                <div class="code-name">&amp;#xe677;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe907;</span>
                <div class="name">57-文件</div>
                <div class="code-name">&amp;#xe907;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe908;</span>
                <div class="name">58-播放</div>
                <div class="code-name">&amp;#xe908;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe909;</span>
                <div class="name">63-单选-选中</div>
                <div class="code-name">&amp;#xe909;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe90a;</span>
                <div class="name">62-单选</div>
                <div class="code-name">&amp;#xe90a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe90b;</span>
                <div class="name">64-对比</div>
                <div class="code-name">&amp;#xe90b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe90c;</span>
                <div class="name">67-正确</div>
                <div class="code-name">&amp;#xe90c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe90d;</span>
                <div class="name">69-主题</div>
                <div class="code-name">&amp;#xe90d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe90e;</span>
                <div class="name">66-指南针</div>
                <div class="code-name">&amp;#xe90e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe90f;</span>
                <div class="name">70-帮助</div>
                <div class="code-name">&amp;#xe90f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe910;</span>
                <div class="name">65-扫脸识别</div>
                <div class="code-name">&amp;#xe910;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe911;</span>
                <div class="name">68-层级</div>
                <div class="code-name">&amp;#xe911;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe912;</span>
                <div class="name">72-二维码</div>
                <div class="code-name">&amp;#xe912;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe913;</span>
                <div class="name">52-手机</div>
                <div class="code-name">&amp;#xe913;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe914;</span>
                <div class="name">49-导入</div>
                <div class="code-name">&amp;#xe914;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe915;</span>
                <div class="name">71-导航</div>
                <div class="code-name">&amp;#xe915;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe916;</span>
                <div class="name">75-刷新</div>
                <div class="code-name">&amp;#xe916;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe917;</span>
                <div class="name">74-交换</div>
                <div class="code-name">&amp;#xe917;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe918;</span>
                <div class="name">77-气球</div>
                <div class="code-name">&amp;#xe918;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe919;</span>
                <div class="name">78-饼图</div>
                <div class="code-name">&amp;#xe919;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe91a;</span>
                <div class="name">80-便签</div>
                <div class="code-name">&amp;#xe91a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe91b;</span>
                <div class="name">76-献血</div>
                <div class="code-name">&amp;#xe91b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe91c;</span>
                <div class="name">73-退出</div>
                <div class="code-name">&amp;#xe91c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe91d;</span>
                <div class="name">79-医院</div>
                <div class="code-name">&amp;#xe91d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe91e;</span>
                <div class="name">82-柱状图</div>
                <div class="code-name">&amp;#xe91e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe91f;</span>
                <div class="name">83-打印</div>
                <div class="code-name">&amp;#xe91f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe920;</span>
                <div class="name">85-邮件</div>
                <div class="code-name">&amp;#xe920;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe921;</span>
                <div class="name">86-购物袋</div>
                <div class="code-name">&amp;#xe921;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe922;</span>
                <div class="name">81-折线图</div>
                <div class="code-name">&amp;#xe922;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe923;</span>
                <div class="name">92-置顶</div>
                <div class="code-name">&amp;#xe923;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe924;</span>
                <div class="name">84-剪刀</div>
                <div class="code-name">&amp;#xe924;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe925;</span>
                <div class="name">89-淋浴</div>
                <div class="code-name">&amp;#xe925;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe926;</span>
                <div class="name">91-详情</div>
                <div class="code-name">&amp;#xe926;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe927;</span>
                <div class="name">94-飞机</div>
                <div class="code-name">&amp;#xe927;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe928;</span>
                <div class="name">88-笑脸</div>
                <div class="code-name">&amp;#xe928;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe929;</span>
                <div class="name">97-用户查询</div>
                <div class="code-name">&amp;#xe929;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe92a;</span>
                <div class="name">90-建筑</div>
                <div class="code-name">&amp;#xe92a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe92b;</span>
                <div class="name">93-隐藏</div>
                <div class="code-name">&amp;#xe92b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe92c;</span>
                <div class="name">101-文件查询</div>
                <div class="code-name">&amp;#xe92c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe92d;</span>
                <div class="name">103-文件审批</div>
                <div class="code-name">&amp;#xe92d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe92e;</span>
                <div class="name">96-洗衣机</div>
                <div class="code-name">&amp;#xe92e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe92f;</span>
                <div class="name">106-喜欢</div>
                <div class="code-name">&amp;#xe92f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe930;</span>
                <div class="name">106-通讯录</div>
                <div class="code-name">&amp;#xe930;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe931;</span>
                <div class="name">104-美食</div>
                <div class="code-name">&amp;#xe931;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe932;</span>
                <div class="name">110-协作</div>
                <div class="code-name">&amp;#xe932;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe933;</span>
                <div class="name">100-文件收藏</div>
                <div class="code-name">&amp;#xe933;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe934;</span>
                <div class="name">105-钱包</div>
                <div class="code-name">&amp;#xe934;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe935;</span>
                <div class="name">111-WiFi</div>
                <div class="code-name">&amp;#xe935;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe936;</span>
                <div class="name">108-系统管理</div>
                <div class="code-name">&amp;#xe936;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe937;</span>
                <div class="name">118-视频通话</div>
                <div class="code-name">&amp;#xe937;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe938;</span>
                <div class="name">115-栏目管理</div>
                <div class="code-name">&amp;#xe938;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe939;</span>
                <div class="name">117-医疗</div>
                <div class="code-name">&amp;#xe939;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe93a;</span>
                <div class="name">119-地图</div>
                <div class="code-name">&amp;#xe93a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe93b;</span>
                <div class="name">123-错误</div>
                <div class="code-name">&amp;#xe93b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe93c;</span>
                <div class="name">99-委员会</div>
                <div class="code-name">&amp;#xe93c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe93d;</span>
                <div class="name">120-配置</div>
                <div class="code-name">&amp;#xe93d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe93e;</span>
                <div class="name">121-全屏</div>
                <div class="code-name">&amp;#xe93e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe93f;</span>
                <div class="name">113-运维服务</div>
                <div class="code-name">&amp;#xe93f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe940;</span>
                <div class="name">126-箭头</div>
                <div class="code-name">&amp;#xe940;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe941;</span>
                <div class="name">112-仪表盘</div>
                <div class="code-name">&amp;#xe941;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe942;</span>
                <div class="name">114-医生</div>
                <div class="code-name">&amp;#xe942;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe943;</span>
                <div class="name">128-火</div>
                <div class="code-name">&amp;#xe943;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe944;</span>
                <div class="name">125-链接</div>
                <div class="code-name">&amp;#xe944;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe945;</span>
                <div class="name">124-跟踪</div>
                <div class="code-name">&amp;#xe945;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe946;</span>
                <div class="name">131-自行车</div>
                <div class="code-name">&amp;#xe946;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe947;</span>
                <div class="name">127-法律</div>
                <div class="code-name">&amp;#xe947;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe948;</span>
                <div class="name">129-邮筒</div>
                <div class="code-name">&amp;#xe948;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe949;</span>
                <div class="name">109-灵感</div>
                <div class="code-name">&amp;#xe949;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe94a;</span>
                <div class="name">95-行李箱</div>
                <div class="code-name">&amp;#xe94a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe94b;</span>
                <div class="name">137-信息管理</div>
                <div class="code-name">&amp;#xe94b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe94c;</span>
                <div class="name">133-学位帽</div>
                <div class="code-name">&amp;#xe94c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe94d;</span>
                <div class="name">136-部门</div>
                <div class="code-name">&amp;#xe94d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe94e;</span>
                <div class="name">141-旅游</div>
                <div class="code-name">&amp;#xe94e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe94f;</span>
                <div class="name">139-附近</div>
                <div class="code-name">&amp;#xe94f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe950;</span>
                <div class="name">144-绿叶</div>
                <div class="code-name">&amp;#xe950;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe951;</span>
                <div class="name">140-银行</div>
                <div class="code-name">&amp;#xe951;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe952;</span>
                <div class="name">134-生日</div>
                <div class="code-name">&amp;#xe952;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe953;</span>
                <div class="name">146-返回</div>
                <div class="code-name">&amp;#xe953;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe954;</span>
                <div class="name">145-代码</div>
                <div class="code-name">&amp;#xe954;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe955;</span>
                <div class="name">143-信用</div>
                <div class="code-name">&amp;#xe955;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe956;</span>
                <div class="name">149-印章</div>
                <div class="code-name">&amp;#xe956;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe957;</span>
                <div class="name">130-汽车</div>
                <div class="code-name">&amp;#xe957;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe958;</span>
                <div class="name">147-删除</div>
                <div class="code-name">&amp;#xe958;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe959;</span>
                <div class="name">153-网络</div>
                <div class="code-name">&amp;#xe959;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe95a;</span>
                <div class="name">116-正确</div>
                <div class="code-name">&amp;#xe95a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe95b;</span>
                <div class="name">160-蓝牙</div>
                <div class="code-name">&amp;#xe95b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe95c;</span>
                <div class="name">152-计算</div>
                <div class="code-name">&amp;#xe95c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe95d;</span>
                <div class="name">157-云</div>
                <div class="code-name">&amp;#xe95d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe95e;</span>
                <div class="name">154-分散</div>
                <div class="code-name">&amp;#xe95e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe95f;</span>
                <div class="name">135-电池</div>
                <div class="code-name">&amp;#xe95f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe960;</span>
                <div class="name">151-水滴</div>
                <div class="code-name">&amp;#xe960;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe961;</span>
                <div class="name">148-文件</div>
                <div class="code-name">&amp;#xe961;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe962;</span>
                <div class="name">155-数据库</div>
                <div class="code-name">&amp;#xe962;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe963;</span>
                <div class="name">162-警徽</div>
                <div class="code-name">&amp;#xe963;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe964;</span>
                <div class="name">122-退出全屏</div>
                <div class="code-name">&amp;#xe964;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe965;</span>
                <div class="name">165-RFID</div>
                <div class="code-name">&amp;#xe965;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe966;</span>
                <div class="name">169-印章</div>
                <div class="code-name">&amp;#xe966;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe967;</span>
                <div class="name">167-还款</div>
                <div class="code-name">&amp;#xe967;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe968;</span>
                <div class="name">142-雨伞</div>
                <div class="code-name">&amp;#xe968;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe969;</span>
                <div class="name">178-视频</div>
                <div class="code-name">&amp;#xe969;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe96a;</span>
                <div class="name">177-新闻</div>
                <div class="code-name">&amp;#xe96a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe96b;</span>
                <div class="name">170-客服</div>
                <div class="code-name">&amp;#xe96b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe96c;</span>
                <div class="name">181-分类</div>
                <div class="code-name">&amp;#xe96c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe96d;</span>
                <div class="name">159-漏斗</div>
                <div class="code-name">&amp;#xe96d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe96e;</span>
                <div class="name">183-系统</div>
                <div class="code-name">&amp;#xe96e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe96f;</span>
                <div class="name">182-设置</div>
                <div class="code-name">&amp;#xe96f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe970;</span>
                <div class="name">168-书</div>
                <div class="code-name">&amp;#xe970;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe971;</span>
                <div class="name">161-拼图</div>
                <div class="code-name">&amp;#xe971;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe972;</span>
                <div class="name">166-NFC</div>
                <div class="code-name">&amp;#xe972;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe973;</span>
                <div class="name">184-任务</div>
                <div class="code-name">&amp;#xe973;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe974;</span>
                <div class="name">164-指纹</div>
                <div class="code-name">&amp;#xe974;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8ce;</span>
                <div class="name">5-信息</div>
                <div class="code-name">&amp;#xe8ce;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8cf;</span>
                <div class="name">3-首页</div>
                <div class="code-name">&amp;#xe8cf;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8d0;</span>
                <div class="name">4-设置</div>
                <div class="code-name">&amp;#xe8d0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8d1;</span>
                <div class="name">6-地点</div>
                <div class="code-name">&amp;#xe8d1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8d2;</span>
                <div class="name">7-品牌</div>
                <div class="code-name">&amp;#xe8d2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8d3;</span>
                <div class="name">9-左</div>
                <div class="code-name">&amp;#xe8d3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8d4;</span>
                <div class="name">11-上</div>
                <div class="code-name">&amp;#xe8d4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8d5;</span>
                <div class="name">8-我的</div>
                <div class="code-name">&amp;#xe8d5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8d6;</span>
                <div class="name">10-右</div>
                <div class="code-name">&amp;#xe8d6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8d7;</span>
                <div class="name">13-喜欢</div>
                <div class="code-name">&amp;#xe8d7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8d8;</span>
                <div class="name">2-菜单</div>
                <div class="code-name">&amp;#xe8d8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8d9;</span>
                <div class="name">15-历史</div>
                <div class="code-name">&amp;#xe8d9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8da;</span>
                <div class="name">1-搜索</div>
                <div class="code-name">&amp;#xe8da;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8db;</span>
                <div class="name">19-优惠</div>
                <div class="code-name">&amp;#xe8db;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8dc;</span>
                <div class="name">12-下</div>
                <div class="code-name">&amp;#xe8dc;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8dd;</span>
                <div class="name">17-扫码</div>
                <div class="code-name">&amp;#xe8dd;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8de;</span>
                <div class="name">20-通知</div>
                <div class="code-name">&amp;#xe8de;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8df;</span>
                <div class="name">14-安全</div>
                <div class="code-name">&amp;#xe8df;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8e0;</span>
                <div class="name">24-编辑</div>
                <div class="code-name">&amp;#xe8e0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8e1;</span>
                <div class="name">18-电话</div>
                <div class="code-name">&amp;#xe8e1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8e2;</span>
                <div class="name">21-修改</div>
                <div class="code-name">&amp;#xe8e2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8e3;</span>
                <div class="name">25-客服</div>
                <div class="code-name">&amp;#xe8e3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8e4;</span>
                <div class="name">23-分享</div>
                <div class="code-name">&amp;#xe8e4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8e5;</span>
                <div class="name">29-星级</div>
                <div class="code-name">&amp;#xe8e5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8e6;</span>
                <div class="name">26-说明</div>
                <div class="code-name">&amp;#xe8e6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8e7;</span>
                <div class="name">30-通知</div>
                <div class="code-name">&amp;#xe8e7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8e8;</span>
                <div class="name">32-文件</div>
                <div class="code-name">&amp;#xe8e8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8e9;</span>
                <div class="name">28-皇冠</div>
                <div class="code-name">&amp;#xe8e9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8ea;</span>
                <div class="name">27-浏览</div>
                <div class="code-name">&amp;#xe8ea;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8eb;</span>
                <div class="name">16-礼物</div>
                <div class="code-name">&amp;#xe8eb;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8ec;</span>
                <div class="name">34-分类</div>
                <div class="code-name">&amp;#xe8ec;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8ed;</span>
                <div class="name">31-店铺</div>
                <div class="code-name">&amp;#xe8ed;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8ee;</span>
                <div class="name">35-图片</div>
                <div class="code-name">&amp;#xe8ee;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8ef;</span>
                <div class="name">38-认证</div>
                <div class="code-name">&amp;#xe8ef;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8f0;</span>
                <div class="name">22-删除</div>
                <div class="code-name">&amp;#xe8f0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8f1;</span>
                <div class="name">33-档案</div>
                <div class="code-name">&amp;#xe8f1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8f2;</span>
                <div class="name">39-上传</div>
                <div class="code-name">&amp;#xe8f2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8f3;</span>
                <div class="name">40-下载</div>
                <div class="code-name">&amp;#xe8f3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8f4;</span>
                <div class="name">43-关闭</div>
                <div class="code-name">&amp;#xe8f4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8f5;</span>
                <div class="name">41-筛选</div>
                <div class="code-name">&amp;#xe8f5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8f6;</span>
                <div class="name">37-卡片</div>
                <div class="code-name">&amp;#xe8f6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8f7;</span>
                <div class="name">45-缩小</div>
                <div class="code-name">&amp;#xe8f7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8f8;</span>
                <div class="name">48-导出</div>
                <div class="code-name">&amp;#xe8f8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8f9;</span>
                <div class="name">42-聚焦</div>
                <div class="code-name">&amp;#xe8f9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8fa;</span>
                <div class="name">44-放大</div>
                <div class="code-name">&amp;#xe8fa;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8fb;</span>
                <div class="name">36-日历</div>
                <div class="code-name">&amp;#xe8fb;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8fc;</span>
                <div class="name">46-锁定</div>
                <div class="code-name">&amp;#xe8fc;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8fd;</span>
                <div class="name">47-解锁</div>
                <div class="code-name">&amp;#xe8fd;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8fe;</span>
                <div class="name">51-电脑</div>
                <div class="code-name">&amp;#xe8fe;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe8ff;</span>
                <div class="name">53-标签</div>
                <div class="code-name">&amp;#xe8ff;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe900;</span>
                <div class="name">54-裁剪</div>
                <div class="code-name">&amp;#xe900;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe901;</span>
                <div class="name">55-复制</div>
                <div class="code-name">&amp;#xe901;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe902;</span>
                <div class="name">59-暂停</div>
                <div class="code-name">&amp;#xe902;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe903;</span>
                <div class="name">50-添加</div>
                <div class="code-name">&amp;#xe903;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe904;</span>
                <div class="name">61-多选-选中</div>
                <div class="code-name">&amp;#xe904;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe905;</span>
                <div class="name">56-篮球</div>
                <div class="code-name">&amp;#xe905;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe906;</span>
                <div class="name">60-多选</div>
                <div class="code-name">&amp;#xe906;</div>
              </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="unicode-">Unicode 引用</h2>
          <hr>

          <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
          <ul>
            <li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
            <li>默认情况下不支持多色，直接添加多色图标会自动去色。</li>
          </ul>
          <blockquote>
            <p>注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）</p>
          </blockquote>
          <p>Unicode 使用步骤如下：</p>
          <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
<pre><code class="language-css"
>@font-face {
  font-family: 'iconfont';
  src: url('iconfont.woff2?t=1658501570851') format('woff2'),
       url('iconfont.woff?t=1658501570851') format('woff'),
       url('iconfont.ttf?t=1658501570851') format('truetype');
}
</code></pre>
          <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
<pre><code class="language-css"
>.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
<pre>
<code class="language-html"
>&lt;span class="iconfont"&gt;&amp;#x33;&lt;/span&gt;
</code></pre>
          <blockquote>
            <p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
          </blockquote>
          </div>
      </div>
      <div class="content font-class">
        <ul class="icon_lists dib-box">
          
          <li class="dib">
            <span class="icon iconfont icon-wubianxing1"></span>
            <div class="name">
              五边形1
            </div>
            <div class="code-name">.icon-wubianxing1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-my-admin"></span>
            <div class="name">
              my-admin
            </div>
            <div class="code-name">.icon-my-admin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-qq"></span>
            <div class="name">
              qq
            </div>
            <div class="code-name">.icon-qq
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-github"></span>
            <div class="name">
              github
            </div>
            <div class="code-name">.icon-github
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-gitee2"></span>
            <div class="name">
              gitee2
            </div>
            <div class="code-name">.icon-gitee2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-57-wenjian"></span>
            <div class="name">
              57-文件
            </div>
            <div class="code-name">.icon-a-57-wenjian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-58-bofang"></span>
            <div class="name">
              58-播放
            </div>
            <div class="code-name">.icon-a-58-bofang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-63-danxuan-xuanzhong"></span>
            <div class="name">
              63-单选-选中
            </div>
            <div class="code-name">.icon-a-63-danxuan-xuanzhong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-62-danxuan"></span>
            <div class="name">
              62-单选
            </div>
            <div class="code-name">.icon-a-62-danxuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-64-duibi"></span>
            <div class="name">
              64-对比
            </div>
            <div class="code-name">.icon-a-64-duibi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-67-zhengque"></span>
            <div class="name">
              67-正确
            </div>
            <div class="code-name">.icon-a-67-zhengque
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-69-zhuti"></span>
            <div class="name">
              69-主题
            </div>
            <div class="code-name">.icon-a-69-zhuti
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-66-zhinanzhen"></span>
            <div class="name">
              66-指南针
            </div>
            <div class="code-name">.icon-a-66-zhinanzhen
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-70-bangzhu"></span>
            <div class="name">
              70-帮助
            </div>
            <div class="code-name">.icon-a-70-bangzhu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-65-saolianshibie"></span>
            <div class="name">
              65-扫脸识别
            </div>
            <div class="code-name">.icon-a-65-saolianshibie
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-68-cengji"></span>
            <div class="name">
              68-层级
            </div>
            <div class="code-name">.icon-a-68-cengji
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-72-erweima"></span>
            <div class="name">
              72-二维码
            </div>
            <div class="code-name">.icon-a-72-erweima
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-52-shouji"></span>
            <div class="name">
              52-手机
            </div>
            <div class="code-name">.icon-a-52-shouji
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-49-daoru"></span>
            <div class="name">
              49-导入
            </div>
            <div class="code-name">.icon-a-49-daoru
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-71-daohang"></span>
            <div class="name">
              71-导航
            </div>
            <div class="code-name">.icon-a-71-daohang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-75-shuaxin"></span>
            <div class="name">
              75-刷新
            </div>
            <div class="code-name">.icon-a-75-shuaxin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-74-jiaohuan"></span>
            <div class="name">
              74-交换
            </div>
            <div class="code-name">.icon-a-74-jiaohuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-77-qiqiu"></span>
            <div class="name">
              77-气球
            </div>
            <div class="code-name">.icon-a-77-qiqiu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-78-bingtu"></span>
            <div class="name">
              78-饼图
            </div>
            <div class="code-name">.icon-a-78-bingtu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-80-bianqian"></span>
            <div class="name">
              80-便签
            </div>
            <div class="code-name">.icon-a-80-bianqian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-76-xianxie"></span>
            <div class="name">
              76-献血
            </div>
            <div class="code-name">.icon-a-76-xianxie
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-73-tuichu"></span>
            <div class="name">
              73-退出
            </div>
            <div class="code-name">.icon-a-73-tuichu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-79-yiyuan"></span>
            <div class="name">
              79-医院
            </div>
            <div class="code-name">.icon-a-79-yiyuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-82-zhuzhuangtu"></span>
            <div class="name">
              82-柱状图
            </div>
            <div class="code-name">.icon-a-82-zhuzhuangtu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-83-dayin"></span>
            <div class="name">
              83-打印
            </div>
            <div class="code-name">.icon-a-83-dayin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-85-youjian"></span>
            <div class="name">
              85-邮件
            </div>
            <div class="code-name">.icon-a-85-youjian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-86-gouwudai"></span>
            <div class="name">
              86-购物袋
            </div>
            <div class="code-name">.icon-a-86-gouwudai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-81-zhexiantu"></span>
            <div class="name">
              81-折线图
            </div>
            <div class="code-name">.icon-a-81-zhexiantu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-92-zhiding"></span>
            <div class="name">
              92-置顶
            </div>
            <div class="code-name">.icon-a-92-zhiding
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-84-jiandao"></span>
            <div class="name">
              84-剪刀
            </div>
            <div class="code-name">.icon-a-84-jiandao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-89-linyu"></span>
            <div class="name">
              89-淋浴
            </div>
            <div class="code-name">.icon-a-89-linyu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-91-xiangqing"></span>
            <div class="name">
              91-详情
            </div>
            <div class="code-name">.icon-a-91-xiangqing
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-94-feiji"></span>
            <div class="name">
              94-飞机
            </div>
            <div class="code-name">.icon-a-94-feiji
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-88-xiaolian"></span>
            <div class="name">
              88-笑脸
            </div>
            <div class="code-name">.icon-a-88-xiaolian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-97-yonghuchaxun"></span>
            <div class="name">
              97-用户查询
            </div>
            <div class="code-name">.icon-a-97-yonghuchaxun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-90-jianzhu"></span>
            <div class="name">
              90-建筑
            </div>
            <div class="code-name">.icon-a-90-jianzhu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-93-yincang"></span>
            <div class="name">
              93-隐藏
            </div>
            <div class="code-name">.icon-a-93-yincang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-101-wenjianchaxun"></span>
            <div class="name">
              101-文件查询
            </div>
            <div class="code-name">.icon-a-101-wenjianchaxun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-103-wenjianshenpi"></span>
            <div class="name">
              103-文件审批
            </div>
            <div class="code-name">.icon-a-103-wenjianshenpi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-96-xiyiji"></span>
            <div class="name">
              96-洗衣机
            </div>
            <div class="code-name">.icon-a-96-xiyiji
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-106-xihuan"></span>
            <div class="name">
              106-喜欢
            </div>
            <div class="code-name">.icon-a-106-xihuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-106-tongxunlu"></span>
            <div class="name">
              106-通讯录
            </div>
            <div class="code-name">.icon-a-106-tongxunlu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-104-meishi"></span>
            <div class="name">
              104-美食
            </div>
            <div class="code-name">.icon-a-104-meishi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-110-xiezuo"></span>
            <div class="name">
              110-协作
            </div>
            <div class="code-name">.icon-a-110-xiezuo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-100-wenjianshoucang"></span>
            <div class="name">
              100-文件收藏
            </div>
            <div class="code-name">.icon-a-100-wenjianshoucang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-105-qianbao"></span>
            <div class="name">
              105-钱包
            </div>
            <div class="code-name">.icon-a-105-qianbao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-111-WiFi"></span>
            <div class="name">
              111-WiFi
            </div>
            <div class="code-name">.icon-a-111-WiFi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-108-xitongguanli"></span>
            <div class="name">
              108-系统管理
            </div>
            <div class="code-name">.icon-a-108-xitongguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-118-yane"></span>
            <div class="name">
              118-视频通话
            </div>
            <div class="code-name">.icon-a-118-yane
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-115-lanmuguanli"></span>
            <div class="name">
              115-栏目管理
            </div>
            <div class="code-name">.icon-a-115-lanmuguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-117-yiliao"></span>
            <div class="name">
              117-医疗
            </div>
            <div class="code-name">.icon-a-117-yiliao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-119-ditu"></span>
            <div class="name">
              119-地图
            </div>
            <div class="code-name">.icon-a-119-ditu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-123-cuowu"></span>
            <div class="name">
              123-错误
            </div>
            <div class="code-name">.icon-a-123-cuowu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-99-weiyuanhui"></span>
            <div class="name">
              99-委员会
            </div>
            <div class="code-name">.icon-a-99-weiyuanhui
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-120-peizhi"></span>
            <div class="name">
              120-配置
            </div>
            <div class="code-name">.icon-a-120-peizhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-121-quanping"></span>
            <div class="name">
              121-全屏
            </div>
            <div class="code-name">.icon-a-121-quanping
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-113-yunweifuwu"></span>
            <div class="name">
              113-运维服务
            </div>
            <div class="code-name">.icon-a-113-yunweifuwu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-126-jiantou"></span>
            <div class="name">
              126-箭头
            </div>
            <div class="code-name">.icon-a-126-jiantou
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-112-yibiaopan"></span>
            <div class="name">
              112-仪表盘
            </div>
            <div class="code-name">.icon-a-112-yibiaopan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-114-yisheng"></span>
            <div class="name">
              114-医生
            </div>
            <div class="code-name">.icon-a-114-yisheng
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-128-huo"></span>
            <div class="name">
              128-火
            </div>
            <div class="code-name">.icon-a-128-huo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-125-lianjie"></span>
            <div class="name">
              125-链接
            </div>
            <div class="code-name">.icon-a-125-lianjie
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-124-genzong"></span>
            <div class="name">
              124-跟踪
            </div>
            <div class="code-name">.icon-a-124-genzong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-131-zihangche"></span>
            <div class="name">
              131-自行车
            </div>
            <div class="code-name">.icon-a-131-zihangche
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-127-falv"></span>
            <div class="name">
              127-法律
            </div>
            <div class="code-name">.icon-a-127-falv
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-129-youtong"></span>
            <div class="name">
              129-邮筒
            </div>
            <div class="code-name">.icon-a-129-youtong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-109-linggan"></span>
            <div class="name">
              109-灵感
            </div>
            <div class="code-name">.icon-a-109-linggan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-95-hanglixiang"></span>
            <div class="name">
              95-行李箱
            </div>
            <div class="code-name">.icon-a-95-hanglixiang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-137-xinxiguanli"></span>
            <div class="name">
              137-信息管理
            </div>
            <div class="code-name">.icon-a-137-xinxiguanli
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-133-xueweimao"></span>
            <div class="name">
              133-学位帽
            </div>
            <div class="code-name">.icon-a-133-xueweimao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-136-bumen"></span>
            <div class="name">
              136-部门
            </div>
            <div class="code-name">.icon-a-136-bumen
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-141-lvyou"></span>
            <div class="name">
              141-旅游
            </div>
            <div class="code-name">.icon-a-141-lvyou
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-139-fujin"></span>
            <div class="name">
              139-附近
            </div>
            <div class="code-name">.icon-a-139-fujin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-144-lvye"></span>
            <div class="name">
              144-绿叶
            </div>
            <div class="code-name">.icon-a-144-lvye
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-140-yinhang"></span>
            <div class="name">
              140-银行
            </div>
            <div class="code-name">.icon-a-140-yinhang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-134-shengri"></span>
            <div class="name">
              134-生日
            </div>
            <div class="code-name">.icon-a-134-shengri
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-146-fanhui"></span>
            <div class="name">
              146-返回
            </div>
            <div class="code-name">.icon-a-146-fanhui
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-145-daima"></span>
            <div class="name">
              145-代码
            </div>
            <div class="code-name">.icon-a-145-daima
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-143-xinyong"></span>
            <div class="name">
              143-信用
            </div>
            <div class="code-name">.icon-a-143-xinyong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-149-yinzhang"></span>
            <div class="name">
              149-印章
            </div>
            <div class="code-name">.icon-a-149-yinzhang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-130-qiche"></span>
            <div class="name">
              130-汽车
            </div>
            <div class="code-name">.icon-a-130-qiche
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-147-shanchu"></span>
            <div class="name">
              147-删除
            </div>
            <div class="code-name">.icon-a-147-shanchu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-153-wangluo"></span>
            <div class="name">
              153-网络
            </div>
            <div class="code-name">.icon-a-153-wangluo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-116-zhengque"></span>
            <div class="name">
              116-正确
            </div>
            <div class="code-name">.icon-a-116-zhengque
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-160-lanya"></span>
            <div class="name">
              160-蓝牙
            </div>
            <div class="code-name">.icon-a-160-lanya
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-152-jisuan"></span>
            <div class="name">
              152-计算
            </div>
            <div class="code-name">.icon-a-152-jisuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-157-yun"></span>
            <div class="name">
              157-云
            </div>
            <div class="code-name">.icon-a-157-yun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-154-fensan"></span>
            <div class="name">
              154-分散
            </div>
            <div class="code-name">.icon-a-154-fensan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-135-dianchi"></span>
            <div class="name">
              135-电池
            </div>
            <div class="code-name">.icon-a-135-dianchi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-151-shuidi"></span>
            <div class="name">
              151-水滴
            </div>
            <div class="code-name">.icon-a-151-shuidi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-148-wenjian"></span>
            <div class="name">
              148-文件
            </div>
            <div class="code-name">.icon-a-148-wenjian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-155-shujuku"></span>
            <div class="name">
              155-数据库
            </div>
            <div class="code-name">.icon-a-155-shujuku
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-162-jinghui"></span>
            <div class="name">
              162-警徽
            </div>
            <div class="code-name">.icon-a-162-jinghui
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-122-tuichuquanping"></span>
            <div class="name">
              122-退出全屏
            </div>
            <div class="code-name">.icon-a-122-tuichuquanping
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-165-RFID"></span>
            <div class="name">
              165-RFID
            </div>
            <div class="code-name">.icon-a-165-RFID
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-169-yinzhang"></span>
            <div class="name">
              169-印章
            </div>
            <div class="code-name">.icon-a-169-yinzhang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-167-huankuan"></span>
            <div class="name">
              167-还款
            </div>
            <div class="code-name">.icon-a-167-huankuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-142-yusan"></span>
            <div class="name">
              142-雨伞
            </div>
            <div class="code-name">.icon-a-142-yusan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-178-shipin"></span>
            <div class="name">
              178-视频
            </div>
            <div class="code-name">.icon-a-178-shipin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-177-xinwen"></span>
            <div class="name">
              177-新闻
            </div>
            <div class="code-name">.icon-a-177-xinwen
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-170-kefu"></span>
            <div class="name">
              170-客服
            </div>
            <div class="code-name">.icon-a-170-kefu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-181-fenlei"></span>
            <div class="name">
              181-分类
            </div>
            <div class="code-name">.icon-a-181-fenlei
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-159-loudou"></span>
            <div class="name">
              159-漏斗
            </div>
            <div class="code-name">.icon-a-159-loudou
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-183-xitong"></span>
            <div class="name">
              183-系统
            </div>
            <div class="code-name">.icon-a-183-xitong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-182-shezhi"></span>
            <div class="name">
              182-设置
            </div>
            <div class="code-name">.icon-a-182-shezhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-168-shu"></span>
            <div class="name">
              168-书
            </div>
            <div class="code-name">.icon-a-168-shu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-161-pintu"></span>
            <div class="name">
              161-拼图
            </div>
            <div class="code-name">.icon-a-161-pintu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-166-NFC"></span>
            <div class="name">
              166-NFC
            </div>
            <div class="code-name">.icon-a-166-NFC
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-184-renwu"></span>
            <div class="name">
              184-任务
            </div>
            <div class="code-name">.icon-a-184-renwu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-164-zhiwen"></span>
            <div class="name">
              164-指纹
            </div>
            <div class="code-name">.icon-a-164-zhiwen
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-5-xinxi"></span>
            <div class="name">
              5-信息
            </div>
            <div class="code-name">.icon-a-5-xinxi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-3-shouye"></span>
            <div class="name">
              3-首页
            </div>
            <div class="code-name">.icon-a-3-shouye
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-4-shezhi"></span>
            <div class="name">
              4-设置
            </div>
            <div class="code-name">.icon-a-4-shezhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-6-didian"></span>
            <div class="name">
              6-地点
            </div>
            <div class="code-name">.icon-a-6-didian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-7-pinpai"></span>
            <div class="name">
              7-品牌
            </div>
            <div class="code-name">.icon-a-7-pinpai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-9-zuo"></span>
            <div class="name">
              9-左
            </div>
            <div class="code-name">.icon-a-9-zuo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-11-shang"></span>
            <div class="name">
              11-上
            </div>
            <div class="code-name">.icon-a-11-shang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-8-wode"></span>
            <div class="name">
              8-我的
            </div>
            <div class="code-name">.icon-a-8-wode
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-10-you"></span>
            <div class="name">
              10-右
            </div>
            <div class="code-name">.icon-a-10-you
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-13-xihuan"></span>
            <div class="name">
              13-喜欢
            </div>
            <div class="code-name">.icon-a-13-xihuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-2-caidan"></span>
            <div class="name">
              2-菜单
            </div>
            <div class="code-name">.icon-a-2-caidan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-15-lishi"></span>
            <div class="name">
              15-历史
            </div>
            <div class="code-name">.icon-a-15-lishi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-1-sousuo"></span>
            <div class="name">
              1-搜索
            </div>
            <div class="code-name">.icon-a-1-sousuo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-19-youhui"></span>
            <div class="name">
              19-优惠
            </div>
            <div class="code-name">.icon-a-19-youhui
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-12-xia"></span>
            <div class="name">
              12-下
            </div>
            <div class="code-name">.icon-a-12-xia
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-17-saoma"></span>
            <div class="name">
              17-扫码
            </div>
            <div class="code-name">.icon-a-17-saoma
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-20-tongzhi"></span>
            <div class="name">
              20-通知
            </div>
            <div class="code-name">.icon-a-20-tongzhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-14-anquan"></span>
            <div class="name">
              14-安全
            </div>
            <div class="code-name">.icon-a-14-anquan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-24-bianji"></span>
            <div class="name">
              24-编辑
            </div>
            <div class="code-name">.icon-a-24-bianji
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-18-dianhua"></span>
            <div class="name">
              18-电话
            </div>
            <div class="code-name">.icon-a-18-dianhua
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-21-xiugai"></span>
            <div class="name">
              21-修改
            </div>
            <div class="code-name">.icon-a-21-xiugai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-25-kefu"></span>
            <div class="name">
              25-客服
            </div>
            <div class="code-name">.icon-a-25-kefu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-23-fenxiang"></span>
            <div class="name">
              23-分享
            </div>
            <div class="code-name">.icon-a-23-fenxiang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-29-xingji"></span>
            <div class="name">
              29-星级
            </div>
            <div class="code-name">.icon-a-29-xingji
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-26-shuoming"></span>
            <div class="name">
              26-说明
            </div>
            <div class="code-name">.icon-a-26-shuoming
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-30-tongzhi"></span>
            <div class="name">
              30-通知
            </div>
            <div class="code-name">.icon-a-30-tongzhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-32-wenjian"></span>
            <div class="name">
              32-文件
            </div>
            <div class="code-name">.icon-a-32-wenjian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-28-huangguan"></span>
            <div class="name">
              28-皇冠
            </div>
            <div class="code-name">.icon-a-28-huangguan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-27-liulan"></span>
            <div class="name">
              27-浏览
            </div>
            <div class="code-name">.icon-a-27-liulan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-16-liwu"></span>
            <div class="name">
              16-礼物
            </div>
            <div class="code-name">.icon-a-16-liwu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-34-fenlei"></span>
            <div class="name">
              34-分类
            </div>
            <div class="code-name">.icon-a-34-fenlei
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-31-dianpu"></span>
            <div class="name">
              31-店铺
            </div>
            <div class="code-name">.icon-a-31-dianpu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-35-tupian"></span>
            <div class="name">
              35-图片
            </div>
            <div class="code-name">.icon-a-35-tupian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-38-renzheng"></span>
            <div class="name">
              38-认证
            </div>
            <div class="code-name">.icon-a-38-renzheng
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-22-shanchu"></span>
            <div class="name">
              22-删除
            </div>
            <div class="code-name">.icon-a-22-shanchu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-33-dangan"></span>
            <div class="name">
              33-档案
            </div>
            <div class="code-name">.icon-a-33-dangan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-39-shangchuan"></span>
            <div class="name">
              39-上传
            </div>
            <div class="code-name">.icon-a-39-shangchuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-40-xiazai"></span>
            <div class="name">
              40-下载
            </div>
            <div class="code-name">.icon-a-40-xiazai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-43-guanbi"></span>
            <div class="name">
              43-关闭
            </div>
            <div class="code-name">.icon-a-43-guanbi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-41-shaixuan"></span>
            <div class="name">
              41-筛选
            </div>
            <div class="code-name">.icon-a-41-shaixuan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-37-kapian"></span>
            <div class="name">
              37-卡片
            </div>
            <div class="code-name">.icon-a-37-kapian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-45-suoxiao"></span>
            <div class="name">
              45-缩小
            </div>
            <div class="code-name">.icon-a-45-suoxiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-48-daochu"></span>
            <div class="name">
              48-导出
            </div>
            <div class="code-name">.icon-a-48-daochu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-42-jujiao"></span>
            <div class="name">
              42-聚焦
            </div>
            <div class="code-name">.icon-a-42-jujiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-44-fangda"></span>
            <div class="name">
              44-放大
            </div>
            <div class="code-name">.icon-a-44-fangda
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-36-rili"></span>
            <div class="name">
              36-日历
            </div>
            <div class="code-name">.icon-a-36-rili
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-46-suoding"></span>
            <div class="name">
              46-锁定
            </div>
            <div class="code-name">.icon-a-46-suoding
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-47-jiesuo"></span>
            <div class="name">
              47-解锁
            </div>
            <div class="code-name">.icon-a-47-jiesuo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-51-diannao"></span>
            <div class="name">
              51-电脑
            </div>
            <div class="code-name">.icon-a-51-diannao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-53-biaoqian"></span>
            <div class="name">
              53-标签
            </div>
            <div class="code-name">.icon-a-53-biaoqian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-54-caijian"></span>
            <div class="name">
              54-裁剪
            </div>
            <div class="code-name">.icon-a-54-caijian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-55-fuzhi"></span>
            <div class="name">
              55-复制
            </div>
            <div class="code-name">.icon-a-55-fuzhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-59-zanting"></span>
            <div class="name">
              59-暂停
            </div>
            <div class="code-name">.icon-a-59-zanting
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-50-tianjia"></span>
            <div class="name">
              50-添加
            </div>
            <div class="code-name">.icon-a-50-tianjia
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-61-duoxuan-xuanzhong"></span>
            <div class="name">
              61-多选-选中
            </div>
            <div class="code-name">.icon-a-61-duoxuan-xuanzhong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-56-lanqiu"></span>
            <div class="name">
              56-篮球
            </div>
            <div class="code-name">.icon-a-56-lanqiu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a-60-duoxuan"></span>
            <div class="name">
              60-多选
            </div>
            <div class="code-name">.icon-a-60-duoxuan
            </div>
          </li>
          
        </ul>
        <div class="article markdown">
        <h2 id="font-class-">font-class 引用</h2>
        <hr>

        <p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
        <p>与 Unicode 使用方式相比，具有如下特点：</p>
        <ul>
          <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
          <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
        </ul>
        <p>使用步骤如下：</p>
        <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
</code></pre>
        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;span class="iconfont icon-xxx"&gt;&lt;/span&gt;
</code></pre>
        <blockquote>
          <p>"
            iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
        </blockquote>
      </div>
      </div>
      <div class="content symbol">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-wubianxing1"></use>
                </svg>
                <div class="name">五边形1</div>
                <div class="code-name">#icon-wubianxing1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-my-admin"></use>
                </svg>
                <div class="name">my-admin</div>
                <div class="code-name">#icon-my-admin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-qq"></use>
                </svg>
                <div class="name">qq</div>
                <div class="code-name">#icon-qq</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-github"></use>
                </svg>
                <div class="name">github</div>
                <div class="code-name">#icon-github</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-gitee2"></use>
                </svg>
                <div class="name">gitee2</div>
                <div class="code-name">#icon-gitee2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-57-wenjian"></use>
                </svg>
                <div class="name">57-文件</div>
                <div class="code-name">#icon-a-57-wenjian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-58-bofang"></use>
                </svg>
                <div class="name">58-播放</div>
                <div class="code-name">#icon-a-58-bofang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-63-danxuan-xuanzhong"></use>
                </svg>
                <div class="name">63-单选-选中</div>
                <div class="code-name">#icon-a-63-danxuan-xuanzhong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-62-danxuan"></use>
                </svg>
                <div class="name">62-单选</div>
                <div class="code-name">#icon-a-62-danxuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-64-duibi"></use>
                </svg>
                <div class="name">64-对比</div>
                <div class="code-name">#icon-a-64-duibi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-67-zhengque"></use>
                </svg>
                <div class="name">67-正确</div>
                <div class="code-name">#icon-a-67-zhengque</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-69-zhuti"></use>
                </svg>
                <div class="name">69-主题</div>
                <div class="code-name">#icon-a-69-zhuti</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-66-zhinanzhen"></use>
                </svg>
                <div class="name">66-指南针</div>
                <div class="code-name">#icon-a-66-zhinanzhen</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-70-bangzhu"></use>
                </svg>
                <div class="name">70-帮助</div>
                <div class="code-name">#icon-a-70-bangzhu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-65-saolianshibie"></use>
                </svg>
                <div class="name">65-扫脸识别</div>
                <div class="code-name">#icon-a-65-saolianshibie</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-68-cengji"></use>
                </svg>
                <div class="name">68-层级</div>
                <div class="code-name">#icon-a-68-cengji</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-72-erweima"></use>
                </svg>
                <div class="name">72-二维码</div>
                <div class="code-name">#icon-a-72-erweima</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-52-shouji"></use>
                </svg>
                <div class="name">52-手机</div>
                <div class="code-name">#icon-a-52-shouji</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-49-daoru"></use>
                </svg>
                <div class="name">49-导入</div>
                <div class="code-name">#icon-a-49-daoru</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-71-daohang"></use>
                </svg>
                <div class="name">71-导航</div>
                <div class="code-name">#icon-a-71-daohang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-75-shuaxin"></use>
                </svg>
                <div class="name">75-刷新</div>
                <div class="code-name">#icon-a-75-shuaxin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-74-jiaohuan"></use>
                </svg>
                <div class="name">74-交换</div>
                <div class="code-name">#icon-a-74-jiaohuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-77-qiqiu"></use>
                </svg>
                <div class="name">77-气球</div>
                <div class="code-name">#icon-a-77-qiqiu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-78-bingtu"></use>
                </svg>
                <div class="name">78-饼图</div>
                <div class="code-name">#icon-a-78-bingtu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-80-bianqian"></use>
                </svg>
                <div class="name">80-便签</div>
                <div class="code-name">#icon-a-80-bianqian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-76-xianxie"></use>
                </svg>
                <div class="name">76-献血</div>
                <div class="code-name">#icon-a-76-xianxie</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-73-tuichu"></use>
                </svg>
                <div class="name">73-退出</div>
                <div class="code-name">#icon-a-73-tuichu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-79-yiyuan"></use>
                </svg>
                <div class="name">79-医院</div>
                <div class="code-name">#icon-a-79-yiyuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-82-zhuzhuangtu"></use>
                </svg>
                <div class="name">82-柱状图</div>
                <div class="code-name">#icon-a-82-zhuzhuangtu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-83-dayin"></use>
                </svg>
                <div class="name">83-打印</div>
                <div class="code-name">#icon-a-83-dayin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-85-youjian"></use>
                </svg>
                <div class="name">85-邮件</div>
                <div class="code-name">#icon-a-85-youjian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-86-gouwudai"></use>
                </svg>
                <div class="name">86-购物袋</div>
                <div class="code-name">#icon-a-86-gouwudai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-81-zhexiantu"></use>
                </svg>
                <div class="name">81-折线图</div>
                <div class="code-name">#icon-a-81-zhexiantu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-92-zhiding"></use>
                </svg>
                <div class="name">92-置顶</div>
                <div class="code-name">#icon-a-92-zhiding</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-84-jiandao"></use>
                </svg>
                <div class="name">84-剪刀</div>
                <div class="code-name">#icon-a-84-jiandao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-89-linyu"></use>
                </svg>
                <div class="name">89-淋浴</div>
                <div class="code-name">#icon-a-89-linyu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-91-xiangqing"></use>
                </svg>
                <div class="name">91-详情</div>
                <div class="code-name">#icon-a-91-xiangqing</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-94-feiji"></use>
                </svg>
                <div class="name">94-飞机</div>
                <div class="code-name">#icon-a-94-feiji</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-88-xiaolian"></use>
                </svg>
                <div class="name">88-笑脸</div>
                <div class="code-name">#icon-a-88-xiaolian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-97-yonghuchaxun"></use>
                </svg>
                <div class="name">97-用户查询</div>
                <div class="code-name">#icon-a-97-yonghuchaxun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-90-jianzhu"></use>
                </svg>
                <div class="name">90-建筑</div>
                <div class="code-name">#icon-a-90-jianzhu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-93-yincang"></use>
                </svg>
                <div class="name">93-隐藏</div>
                <div class="code-name">#icon-a-93-yincang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-101-wenjianchaxun"></use>
                </svg>
                <div class="name">101-文件查询</div>
                <div class="code-name">#icon-a-101-wenjianchaxun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-103-wenjianshenpi"></use>
                </svg>
                <div class="name">103-文件审批</div>
                <div class="code-name">#icon-a-103-wenjianshenpi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-96-xiyiji"></use>
                </svg>
                <div class="name">96-洗衣机</div>
                <div class="code-name">#icon-a-96-xiyiji</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-106-xihuan"></use>
                </svg>
                <div class="name">106-喜欢</div>
                <div class="code-name">#icon-a-106-xihuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-106-tongxunlu"></use>
                </svg>
                <div class="name">106-通讯录</div>
                <div class="code-name">#icon-a-106-tongxunlu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-104-meishi"></use>
                </svg>
                <div class="name">104-美食</div>
                <div class="code-name">#icon-a-104-meishi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-110-xiezuo"></use>
                </svg>
                <div class="name">110-协作</div>
                <div class="code-name">#icon-a-110-xiezuo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-100-wenjianshoucang"></use>
                </svg>
                <div class="name">100-文件收藏</div>
                <div class="code-name">#icon-a-100-wenjianshoucang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-105-qianbao"></use>
                </svg>
                <div class="name">105-钱包</div>
                <div class="code-name">#icon-a-105-qianbao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-111-WiFi"></use>
                </svg>
                <div class="name">111-WiFi</div>
                <div class="code-name">#icon-a-111-WiFi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-108-xitongguanli"></use>
                </svg>
                <div class="name">108-系统管理</div>
                <div class="code-name">#icon-a-108-xitongguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-118-yane"></use>
                </svg>
                <div class="name">118-视频通话</div>
                <div class="code-name">#icon-a-118-yane</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-115-lanmuguanli"></use>
                </svg>
                <div class="name">115-栏目管理</div>
                <div class="code-name">#icon-a-115-lanmuguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-117-yiliao"></use>
                </svg>
                <div class="name">117-医疗</div>
                <div class="code-name">#icon-a-117-yiliao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-119-ditu"></use>
                </svg>
                <div class="name">119-地图</div>
                <div class="code-name">#icon-a-119-ditu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-123-cuowu"></use>
                </svg>
                <div class="name">123-错误</div>
                <div class="code-name">#icon-a-123-cuowu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-99-weiyuanhui"></use>
                </svg>
                <div class="name">99-委员会</div>
                <div class="code-name">#icon-a-99-weiyuanhui</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-120-peizhi"></use>
                </svg>
                <div class="name">120-配置</div>
                <div class="code-name">#icon-a-120-peizhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-121-quanping"></use>
                </svg>
                <div class="name">121-全屏</div>
                <div class="code-name">#icon-a-121-quanping</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-113-yunweifuwu"></use>
                </svg>
                <div class="name">113-运维服务</div>
                <div class="code-name">#icon-a-113-yunweifuwu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-126-jiantou"></use>
                </svg>
                <div class="name">126-箭头</div>
                <div class="code-name">#icon-a-126-jiantou</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-112-yibiaopan"></use>
                </svg>
                <div class="name">112-仪表盘</div>
                <div class="code-name">#icon-a-112-yibiaopan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-114-yisheng"></use>
                </svg>
                <div class="name">114-医生</div>
                <div class="code-name">#icon-a-114-yisheng</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-128-huo"></use>
                </svg>
                <div class="name">128-火</div>
                <div class="code-name">#icon-a-128-huo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-125-lianjie"></use>
                </svg>
                <div class="name">125-链接</div>
                <div class="code-name">#icon-a-125-lianjie</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-124-genzong"></use>
                </svg>
                <div class="name">124-跟踪</div>
                <div class="code-name">#icon-a-124-genzong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-131-zihangche"></use>
                </svg>
                <div class="name">131-自行车</div>
                <div class="code-name">#icon-a-131-zihangche</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-127-falv"></use>
                </svg>
                <div class="name">127-法律</div>
                <div class="code-name">#icon-a-127-falv</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-129-youtong"></use>
                </svg>
                <div class="name">129-邮筒</div>
                <div class="code-name">#icon-a-129-youtong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-109-linggan"></use>
                </svg>
                <div class="name">109-灵感</div>
                <div class="code-name">#icon-a-109-linggan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-95-hanglixiang"></use>
                </svg>
                <div class="name">95-行李箱</div>
                <div class="code-name">#icon-a-95-hanglixiang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-137-xinxiguanli"></use>
                </svg>
                <div class="name">137-信息管理</div>
                <div class="code-name">#icon-a-137-xinxiguanli</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-133-xueweimao"></use>
                </svg>
                <div class="name">133-学位帽</div>
                <div class="code-name">#icon-a-133-xueweimao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-136-bumen"></use>
                </svg>
                <div class="name">136-部门</div>
                <div class="code-name">#icon-a-136-bumen</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-141-lvyou"></use>
                </svg>
                <div class="name">141-旅游</div>
                <div class="code-name">#icon-a-141-lvyou</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-139-fujin"></use>
                </svg>
                <div class="name">139-附近</div>
                <div class="code-name">#icon-a-139-fujin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-144-lvye"></use>
                </svg>
                <div class="name">144-绿叶</div>
                <div class="code-name">#icon-a-144-lvye</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-140-yinhang"></use>
                </svg>
                <div class="name">140-银行</div>
                <div class="code-name">#icon-a-140-yinhang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-134-shengri"></use>
                </svg>
                <div class="name">134-生日</div>
                <div class="code-name">#icon-a-134-shengri</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-146-fanhui"></use>
                </svg>
                <div class="name">146-返回</div>
                <div class="code-name">#icon-a-146-fanhui</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-145-daima"></use>
                </svg>
                <div class="name">145-代码</div>
                <div class="code-name">#icon-a-145-daima</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-143-xinyong"></use>
                </svg>
                <div class="name">143-信用</div>
                <div class="code-name">#icon-a-143-xinyong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-149-yinzhang"></use>
                </svg>
                <div class="name">149-印章</div>
                <div class="code-name">#icon-a-149-yinzhang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-130-qiche"></use>
                </svg>
                <div class="name">130-汽车</div>
                <div class="code-name">#icon-a-130-qiche</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-147-shanchu"></use>
                </svg>
                <div class="name">147-删除</div>
                <div class="code-name">#icon-a-147-shanchu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-153-wangluo"></use>
                </svg>
                <div class="name">153-网络</div>
                <div class="code-name">#icon-a-153-wangluo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-116-zhengque"></use>
                </svg>
                <div class="name">116-正确</div>
                <div class="code-name">#icon-a-116-zhengque</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-160-lanya"></use>
                </svg>
                <div class="name">160-蓝牙</div>
                <div class="code-name">#icon-a-160-lanya</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-152-jisuan"></use>
                </svg>
                <div class="name">152-计算</div>
                <div class="code-name">#icon-a-152-jisuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-157-yun"></use>
                </svg>
                <div class="name">157-云</div>
                <div class="code-name">#icon-a-157-yun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-154-fensan"></use>
                </svg>
                <div class="name">154-分散</div>
                <div class="code-name">#icon-a-154-fensan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-135-dianchi"></use>
                </svg>
                <div class="name">135-电池</div>
                <div class="code-name">#icon-a-135-dianchi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-151-shuidi"></use>
                </svg>
                <div class="name">151-水滴</div>
                <div class="code-name">#icon-a-151-shuidi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-148-wenjian"></use>
                </svg>
                <div class="name">148-文件</div>
                <div class="code-name">#icon-a-148-wenjian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-155-shujuku"></use>
                </svg>
                <div class="name">155-数据库</div>
                <div class="code-name">#icon-a-155-shujuku</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-162-jinghui"></use>
                </svg>
                <div class="name">162-警徽</div>
                <div class="code-name">#icon-a-162-jinghui</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-122-tuichuquanping"></use>
                </svg>
                <div class="name">122-退出全屏</div>
                <div class="code-name">#icon-a-122-tuichuquanping</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-165-RFID"></use>
                </svg>
                <div class="name">165-RFID</div>
                <div class="code-name">#icon-a-165-RFID</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-169-yinzhang"></use>
                </svg>
                <div class="name">169-印章</div>
                <div class="code-name">#icon-a-169-yinzhang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-167-huankuan"></use>
                </svg>
                <div class="name">167-还款</div>
                <div class="code-name">#icon-a-167-huankuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-142-yusan"></use>
                </svg>
                <div class="name">142-雨伞</div>
                <div class="code-name">#icon-a-142-yusan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-178-shipin"></use>
                </svg>
                <div class="name">178-视频</div>
                <div class="code-name">#icon-a-178-shipin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-177-xinwen"></use>
                </svg>
                <div class="name">177-新闻</div>
                <div class="code-name">#icon-a-177-xinwen</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-170-kefu"></use>
                </svg>
                <div class="name">170-客服</div>
                <div class="code-name">#icon-a-170-kefu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-181-fenlei"></use>
                </svg>
                <div class="name">181-分类</div>
                <div class="code-name">#icon-a-181-fenlei</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-159-loudou"></use>
                </svg>
                <div class="name">159-漏斗</div>
                <div class="code-name">#icon-a-159-loudou</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-183-xitong"></use>
                </svg>
                <div class="name">183-系统</div>
                <div class="code-name">#icon-a-183-xitong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-182-shezhi"></use>
                </svg>
                <div class="name">182-设置</div>
                <div class="code-name">#icon-a-182-shezhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-168-shu"></use>
                </svg>
                <div class="name">168-书</div>
                <div class="code-name">#icon-a-168-shu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-161-pintu"></use>
                </svg>
                <div class="name">161-拼图</div>
                <div class="code-name">#icon-a-161-pintu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-166-NFC"></use>
                </svg>
                <div class="name">166-NFC</div>
                <div class="code-name">#icon-a-166-NFC</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-184-renwu"></use>
                </svg>
                <div class="name">184-任务</div>
                <div class="code-name">#icon-a-184-renwu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-164-zhiwen"></use>
                </svg>
                <div class="name">164-指纹</div>
                <div class="code-name">#icon-a-164-zhiwen</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-5-xinxi"></use>
                </svg>
                <div class="name">5-信息</div>
                <div class="code-name">#icon-a-5-xinxi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-3-shouye"></use>
                </svg>
                <div class="name">3-首页</div>
                <div class="code-name">#icon-a-3-shouye</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-4-shezhi"></use>
                </svg>
                <div class="name">4-设置</div>
                <div class="code-name">#icon-a-4-shezhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-6-didian"></use>
                </svg>
                <div class="name">6-地点</div>
                <div class="code-name">#icon-a-6-didian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-7-pinpai"></use>
                </svg>
                <div class="name">7-品牌</div>
                <div class="code-name">#icon-a-7-pinpai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-9-zuo"></use>
                </svg>
                <div class="name">9-左</div>
                <div class="code-name">#icon-a-9-zuo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-11-shang"></use>
                </svg>
                <div class="name">11-上</div>
                <div class="code-name">#icon-a-11-shang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-8-wode"></use>
                </svg>
                <div class="name">8-我的</div>
                <div class="code-name">#icon-a-8-wode</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-10-you"></use>
                </svg>
                <div class="name">10-右</div>
                <div class="code-name">#icon-a-10-you</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-13-xihuan"></use>
                </svg>
                <div class="name">13-喜欢</div>
                <div class="code-name">#icon-a-13-xihuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-2-caidan"></use>
                </svg>
                <div class="name">2-菜单</div>
                <div class="code-name">#icon-a-2-caidan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-15-lishi"></use>
                </svg>
                <div class="name">15-历史</div>
                <div class="code-name">#icon-a-15-lishi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-1-sousuo"></use>
                </svg>
                <div class="name">1-搜索</div>
                <div class="code-name">#icon-a-1-sousuo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-19-youhui"></use>
                </svg>
                <div class="name">19-优惠</div>
                <div class="code-name">#icon-a-19-youhui</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-12-xia"></use>
                </svg>
                <div class="name">12-下</div>
                <div class="code-name">#icon-a-12-xia</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-17-saoma"></use>
                </svg>
                <div class="name">17-扫码</div>
                <div class="code-name">#icon-a-17-saoma</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-20-tongzhi"></use>
                </svg>
                <div class="name">20-通知</div>
                <div class="code-name">#icon-a-20-tongzhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-14-anquan"></use>
                </svg>
                <div class="name">14-安全</div>
                <div class="code-name">#icon-a-14-anquan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-24-bianji"></use>
                </svg>
                <div class="name">24-编辑</div>
                <div class="code-name">#icon-a-24-bianji</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-18-dianhua"></use>
                </svg>
                <div class="name">18-电话</div>
                <div class="code-name">#icon-a-18-dianhua</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-21-xiugai"></use>
                </svg>
                <div class="name">21-修改</div>
                <div class="code-name">#icon-a-21-xiugai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-25-kefu"></use>
                </svg>
                <div class="name">25-客服</div>
                <div class="code-name">#icon-a-25-kefu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-23-fenxiang"></use>
                </svg>
                <div class="name">23-分享</div>
                <div class="code-name">#icon-a-23-fenxiang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-29-xingji"></use>
                </svg>
                <div class="name">29-星级</div>
                <div class="code-name">#icon-a-29-xingji</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-26-shuoming"></use>
                </svg>
                <div class="name">26-说明</div>
                <div class="code-name">#icon-a-26-shuoming</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-30-tongzhi"></use>
                </svg>
                <div class="name">30-通知</div>
                <div class="code-name">#icon-a-30-tongzhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-32-wenjian"></use>
                </svg>
                <div class="name">32-文件</div>
                <div class="code-name">#icon-a-32-wenjian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-28-huangguan"></use>
                </svg>
                <div class="name">28-皇冠</div>
                <div class="code-name">#icon-a-28-huangguan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-27-liulan"></use>
                </svg>
                <div class="name">27-浏览</div>
                <div class="code-name">#icon-a-27-liulan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-16-liwu"></use>
                </svg>
                <div class="name">16-礼物</div>
                <div class="code-name">#icon-a-16-liwu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-34-fenlei"></use>
                </svg>
                <div class="name">34-分类</div>
                <div class="code-name">#icon-a-34-fenlei</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-31-dianpu"></use>
                </svg>
                <div class="name">31-店铺</div>
                <div class="code-name">#icon-a-31-dianpu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-35-tupian"></use>
                </svg>
                <div class="name">35-图片</div>
                <div class="code-name">#icon-a-35-tupian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-38-renzheng"></use>
                </svg>
                <div class="name">38-认证</div>
                <div class="code-name">#icon-a-38-renzheng</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-22-shanchu"></use>
                </svg>
                <div class="name">22-删除</div>
                <div class="code-name">#icon-a-22-shanchu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-33-dangan"></use>
                </svg>
                <div class="name">33-档案</div>
                <div class="code-name">#icon-a-33-dangan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-39-shangchuan"></use>
                </svg>
                <div class="name">39-上传</div>
                <div class="code-name">#icon-a-39-shangchuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-40-xiazai"></use>
                </svg>
                <div class="name">40-下载</div>
                <div class="code-name">#icon-a-40-xiazai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-43-guanbi"></use>
                </svg>
                <div class="name">43-关闭</div>
                <div class="code-name">#icon-a-43-guanbi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-41-shaixuan"></use>
                </svg>
                <div class="name">41-筛选</div>
                <div class="code-name">#icon-a-41-shaixuan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-37-kapian"></use>
                </svg>
                <div class="name">37-卡片</div>
                <div class="code-name">#icon-a-37-kapian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-45-suoxiao"></use>
                </svg>
                <div class="name">45-缩小</div>
                <div class="code-name">#icon-a-45-suoxiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-48-daochu"></use>
                </svg>
                <div class="name">48-导出</div>
                <div class="code-name">#icon-a-48-daochu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-42-jujiao"></use>
                </svg>
                <div class="name">42-聚焦</div>
                <div class="code-name">#icon-a-42-jujiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-44-fangda"></use>
                </svg>
                <div class="name">44-放大</div>
                <div class="code-name">#icon-a-44-fangda</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-36-rili"></use>
                </svg>
                <div class="name">36-日历</div>
                <div class="code-name">#icon-a-36-rili</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-46-suoding"></use>
                </svg>
                <div class="name">46-锁定</div>
                <div class="code-name">#icon-a-46-suoding</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-47-jiesuo"></use>
                </svg>
                <div class="name">47-解锁</div>
                <div class="code-name">#icon-a-47-jiesuo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-51-diannao"></use>
                </svg>
                <div class="name">51-电脑</div>
                <div class="code-name">#icon-a-51-diannao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-53-biaoqian"></use>
                </svg>
                <div class="name">53-标签</div>
                <div class="code-name">#icon-a-53-biaoqian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-54-caijian"></use>
                </svg>
                <div class="name">54-裁剪</div>
                <div class="code-name">#icon-a-54-caijian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-55-fuzhi"></use>
                </svg>
                <div class="name">55-复制</div>
                <div class="code-name">#icon-a-55-fuzhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-59-zanting"></use>
                </svg>
                <div class="name">59-暂停</div>
                <div class="code-name">#icon-a-59-zanting</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-50-tianjia"></use>
                </svg>
                <div class="name">50-添加</div>
                <div class="code-name">#icon-a-50-tianjia</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-61-duoxuan-xuanzhong"></use>
                </svg>
                <div class="name">61-多选-选中</div>
                <div class="code-name">#icon-a-61-duoxuan-xuanzhong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-56-lanqiu"></use>
                </svg>
                <div class="name">56-篮球</div>
                <div class="code-name">#icon-a-56-lanqiu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a-60-duoxuan"></use>
                </svg>
                <div class="name">60-多选</div>
                <div class="code-name">#icon-a-60-duoxuan</div>
            </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="symbol-">Symbol 引用</h2>
          <hr>

          <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
            这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
          <ul>
            <li>支持多色图标了，不再受单色限制。</li>
            <li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
            <li>兼容性较差，支持 IE9+，及现代浏览器。</li>
            <li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
          </ul>
          <p>使用步骤如下：</p>
          <h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
</code></pre>
          <h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
<pre><code class="language-html">&lt;style&gt;
.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}
&lt;/style&gt;
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
  &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
&lt;/svg&gt;
</code></pre>
          </div>
      </div>

    </div>
  </div>
  <script>
  $(document).ready(function () {
      $('.tab-container .content:first').show()

      $('#tabs li').click(function (e) {
        var tabContent = $('.tab-container .content')
        var index = $(this).index()

        if ($(this).hasClass('active')) {
          return
        } else {
          $('#tabs li').removeClass('active')
          $(this).addClass('active')

          tabContent.hide().eq(index).fadeIn()
        }
      })
    })
  </script>
</body>
</html>
